{extend name="public/base"/} {block name="body"}
<style>
    .mui-row.mui-fullscreen>[class*="mui-col-"] {
        height: 100%;
    }

    .mui-col-xs-3,
    .mui-col-xs-9 {
        overflow-y: auto;
        height: 100%;
    }

    .mui-segmented-control .mui-control-item {
        line-height: 50px;
        width: 100%;
    }

    .mui-control-content {
        display: block;
    }

    .mui-segmented-control.mui-segmented-control-inverted .mui-control-item.mui-active {
        background-color: #fff;
    }
    .mui-toast-container {
        bottom: 50%;
        z-index: 999999999999999999;
    }
    .mui-btn-block{
      padding: 5px;
      border: 1px solid #ccc !important;
      margin: 5px;
      -webkit-appearance: none;
    }
    .active .mui-icon{
      display: block !important;
    }
    .paylist.open{
          overflow-y: scroll;
    }

    .info-box{
      background-color: #3190e8;
      padding: .4rem .4rem;
      color:#fff;
    }
    .info-box .headimg {
      padding: 0.5rem 0;
    }
    .info-box .headimg img{

      font-size: 1.6rem;
      line-height: 1.6rem;
      width: 1.6rem;
      border-radius: 50%;
      height: 1.6rem;
      background: #fff;
      display: inline-block;
      vertical-align: middle;

    }
    .balance{
          color: #f90;
    }
    .hongbao{
          color: #ff5f3e;
    }
    .score{
            color: #6ac20b;
    }
    .mui-row {
      background-color: #fff;
    }
    .mui-row .mui-col-xs-6{
      padding: .453333rem 0 .293333rem;
      font-size: .32rem;
      line-height: .32rem;
      border-right: 1px solid #ddd;
    }

    .mui-row .mui-col-xs-6 span{
       font-size: .693333rem;
       line-height: .693333rem;
       font-weight: 700;
    }
</style>
<link rel="stylesheet" type="text/css" href="__PUBLIC__/xsd/css/checkout.css" />
<link rel="stylesheet" type="text/css" href="__PUBLIC__/xsd/css/mui.picker.min.css" />
<header class="mui-bar mui-bar-nav" >
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">会员留言</h1>
</header>
<div class="mui-content" style="    margin-bottom:60px;">
  <div class="info-box mui-text-center">
    <div class="headimg">
      <img src="{$Think.session.user.headimgurl}">
    </div>
    <h4>Hi.{$Think.session.user.nickname}  {notempty name="$Think.session.user.name" }(会员){/notempty}</h4>
  </div>

<br />
  <div class="mui-card" style="padding:10px;">
    <form class="mui-input-group" method="post" >
    					<div class="mui-input-row">
    						<label>留言内容</label>

    					</div>

                              <textarea name="content" rows="8" cols="80" placeholder="请输入内容" style="      border: 1px solid #ccc;"></textarea>

              <div>
                {empty name="$Think.session.user.name"}
                    <a href="{:url('user/info')}" class="mui-btn mui-btn-primary" style="width:100%;margin-top:20px;">请先注册会员！</a>
                {else /}
              		<button type="button" class="mui-btn mui-btn-primary sbt" onclick="return false;" style="width:100%;margin-top:20px;">确认</button>&nbsp;&nbsp;
                {/empty}
              					</div>
    				</form>

            {:config('message_dec')}


            <h3 style="    padding-left: 0;
    margin-top: 30px;
    border-top: 2px solid red;
    padding-top: 20px;">历史留言：</h3>

            <ul class="mui-table-view">
              {volist name="list" id="vo"}
                <li class="mui-table-view-cell">
                  <p>
                    留言时间：{$vo.create_time|time_format}
                  </p>
                  <p>
                    留言内容：{$vo.content|strip_tags}
                  </p>

                  {notempty name="$vo.messageReply"}
                  <p>
                    回复时间：{$vo.messageReply.create_time|time_format}
                  </p>
                  <p>
                    回复内容：{$vo.messageReply.content|strip_tags}
                  </p>
                  {/notempty}

                </li>
              {/volist}
            </ul>
            <a href="{:url('message/lists')}" class="mui-btn" style="width:100%;margin-top:20px;">查看更多历史留言</a>
  </div>


</div>


{/block}
{block name="script"}
<script src="__PUBLIC__/xsd/js/mui.picker.min.js"></script>
<script type="text/javascript">


$(function(){

  $('.sbt').click(function(){
       var content = $.trim($('[name="content"]').val()),
           user_id = "{$Think.session.user.id}"
      if(!content){
        mui.toast('请输入内容')
        return;
      }


       $.post("{:url('index/message/add')}", {
           "content": content,
           "user_id": user_id
       }, function(data) {

          mui.toast(data.msg)
          setTimeout(function() {
              window.history.back();location.reload();
          }, 2000);
       }, "json");
  })

})
</script>
{/block}
